<template>
    <view>
		<cu-custom :bgColor="NavBarColor" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">定位</block>
		</cu-custom>
		<map 
		style="width: 100%; height:500px;" 
		:latitude="latitude" 
		:longitude="longitude" 
		:markers="marker"
		:circles="circles"
		:scale="scale"
		:key="menuKey"
		
		>
		</map>
    </view>
	
</template>

<script>
	export default {
	    data() {
	        return {
				NavBarColor:this.NavBarColor,
	            id:0, // 使用 marker点击事件 需要填写id
	            title: 'map',
	          　latitude: '',  //纬度
		　　    longitude: '',  //经度
		       timer: null,
			   menuKey:1,
		  　　　marker: [{
			   　　id:0,
			   　　latitude: '',//纬度
			   　　longitude: '',//经度
			   　　iconPath: '/static/mar.png',    //显示的图标        
			   　　rotate:0,   // 旋转度数
			   　　width:20,   //宽
			   　　height:20,   //高
			  　　 title:'你在哪了',//标注点名
			  　　 alpha:0.5,   //透明度
			   callout:{//自定义标记点上方的气泡窗口 点击有效  
			   　　content:'',//文本
			   　　color:'#ffffff',//文字颜色
			   　　fontSize:14,//文本大小
			   　　borderRadius:2,//边框圆角
			  　　 bgColor:'#00c16f',//背景颜色
			   　　display:'ALWAYS'//常显
			   }						
		   }],
		   scale:14,
	   　 circles:[{//在地图上显示圆
		  　　latitude: '',
		  　　longitude: '',
		  　　radius:400,//半径
		      fillColor:"#ffffffAA",//填充颜色
		  　　color:"#55aaffAA",//描边的颜色
		 　　 strokeWidth:1//描边的宽度
		  }], 
	     }
	    },
		onLoad() {
			this.getLocation();
		},
		onUnload() {
			if(this.timer) {  
				clearInterval(this.timer);  
				this.timer = null;  
			}  
		},
	    methods: {
			getLocation(){
				var that=this;
				uni.getLocation({
				    type: 'gcj02',
				    success: function (res) {
						that.marker[0].longitude= res.longitude;
						that.marker[0].latitude = res.latitude;
						that.circles[0].longitude= res.longitude;
						that.circles[0].latitude = res.latitude;
						that.longitude= res.longitude;
						that.latitude = res.latitude;
						++that.menuKey
				        
				    },
					fail: function (res) {
						 console.log('当前位置的经度');
					}	
				});
			},submit(){
				uni.navigateTo({
						url: '/pages/common/task'
				});
				
			}
	    }
	}
</script>

<style>
</style>
